<template>
  <div class="PetList">
    <div class="classify">
      <p
        v-for="item in nav"
        :key="item.classifyId"
        :class="item.classifyInfo==claasify?'hovers':'nohover'"
        @click="homeinfodata(item)"
      >{{item.classifyInfo}}</p>
    </div>
    <div class="synopsis" @click="$router.push({name:'details'})" v-for="item in homeinfo" :key="item.petId">
      <img :src="'http://'+ item.petImage[0].petImage" alt />
      <div class="synopsis-txte">
        <div class="synopsis-name">{{item.petName}}</div>
        <div class="labels-one">
          <div>{{item.petAge}}岁</div>
          <div>{{item.petSex}}</div>
          <div>{{item.petShape}}</div>
          <div>已实名</div>
          <div>{{item.petLocation}}</div>
        </div>
        <div
          class="introduce"
        >宝宝健康活泼；纯度好；宝宝驱虫已经做干净了；体内体外都驱干净了；疫苗做的是荷兰英特威的进口疫苗；分别是荷兰俩联 ......4联 和4联 喜欢的朋友联系我</div>
        <div class="labels-two">
          <div>{{item.petImmune}}</div>
          <div>{{item.petSterilization}}</div>
          <div>{{item.petDewroming}}</div>
          <div>{{item.petHair}}</div>
        </div>
      </div>
    </div>
  </div>
</template>
<script src="./PetList.js"></script>
<style lang="scss">
@import "./PetList.scss";
</style>